Check Icon Not Appearing Correctly when Using JQuery Linear


Topic: Check Icon Not Appearing Correctly when Using JQuery Linear Stepper

scottposh asked 6 years ago

Hello!

I just purchased the complete Jquery UI Kit. Overall very happy with it, good work!!! :)

One issue though - I'm using the Linear Stepper (https://mdbootstrap.com/docs/jquery/components/stepper/#!) and I wanted to Font Awesome check mark icon to appear when you finish each step (instead of the blank square which is confusing). The font awesome code is f00c.

I dug into it a little more and it looks like you guys are using that font awesome code already, but it's not working. Can you please look into this and let me know how we can fix it?

Thank you!

Scott


Marta Szymanska staff pro premium answered 6 years ago

Hi,

add this code to your CSS:

ul.stepper .step.active:before { content'\f00c'font-size1rem; }
ul.stepper .step.done:before, ul.stepper .step.wrong:before { font-family'Font Awesome 5 free'font-weight900; }
 
Best,
Marta

scottposh answered 6 years ago

That fixed it!! Thanks for the quick & helpful response :)


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.5.15
  • Device: all
  • Browser: all
  • OS: all
  • Provided sample code: No
  • Provided link: Yes
Tags